<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <script src="js/jquery-3.3.1.min.js"></script>

    <script>
        $(function () {
            //给username绑定blur事件
            $("#username").blur(function () {
                //获取username文本输入框的值
                var username = $(this).val();
                //发送ajax请求
                $.get("findUserServlet", {username: username}, function (data) {
                    //判断userExist键的值是否为true;
                    var span = $("#span");
                    if (data.userExist) {
                        //用户名存在
                        span.css("color", "red");
                    } else {
                        //用户名不存在
                        span.css("color", "green");
                    }
                    span.html(data.msg);
                }, "json");
                //记得在后面补一个json类型
            });
        });
    </script>
</head>
<body>
<form action="#" method="get">
    <input id="username" name="username" placeholder="请输入用户名" type="text">
    <span id="span"></span><br>
    <input name="password" placeholder="请输入密码" type="password"><br>
    <input type="submit" value="提交">
</form>
</body>
</html>